<template>
	<div class="result">
		<div class="part1" v-if="payStatus == 200">
			<img src="../../assets/images/img1.png" alt="">
			<h4>即将获得【健康<font>直播课</font>】</h4>
			<div class="btn" @click="getRes">立即打开</div>
		</div>

		<div class="part2" v-if="payStatus == 200">
			<h3>操作引导</h3>
			<div class="step">
				<div class="tit">
					<span class="num">1</span>
					<span class="txt">第一步</span>
				</div>
				<p>点击【立即打开】按钮，打开微信</p>
			</div>
			<div class="step">
				<div class="tit">
					<span class="num">2</span>
					<span class="txt">第二步</span>
				</div>
				<p>微信中【添加老师微信】，上直播课</p>
			</div>
		</div>
		<div class="part3" v-else>
			<div class="btn" @click="getPay">支付失败</div>
			<div>即将返回上一页，请耐心等待。。。</div>
		</div>
	</div>
</template>

<script>
	import axios from 'axios';

	export default {
		data () {
			return {
				payStatus:'',
				payType:'',
			}
		},
		created(){
			this.payStatus = this.$route.query.status
			this.getRes()
		},
		methods:{
			getRes(){
				this.payStatus == 200 ? this.wechatOpen() : this.getPay()
			},
			getPay(){
				this.$router.go(-1)
			},
			//打开获客链接
			wechatOpen(){
				axios({
					method:"POST",
					url:`${this.$baseURL}/getWechatIndexClass`,
					params: {
						userPhone: this.$store.state.userPhone,
					}
				}).then(res => {
					if(res.data.code == 200){
						let data = res.data.data
						this.custSms(data.class_id,data.class_user_id)
						window.location.href = data.class_wechat_index + '?customer_channel=' + data.class_id + '_H5' + '_' + this.$store.state.product
					}else{
						this.$message({message: res.data.message});
					}
				})
			},
			//下发客户短信
			custSms(id,wx){
				axios({
					method:"POST",
					url:`${this.$backend}/customer_acquisition/send_signup_sms`,
					data: {
						"class_id": id,
    					"wx_user_id":wx
					}
				}).then(res => {
					console.log(res)
				})
			},
			//获取微信toekn
			// getToken(){
			// 	axios.get(`${this.$siteURL}/wxapi/cgi-bin/token?grant_type=client_credential&appid=${this.$wechatAppid}&secret=${this.$wechatSecret}`).then(res => {
			// 		if(res.status == 200){
			// 			this.getScheme(res.data.access_token)
			// 		}
			// 	})
			// },
			// //获取加密scheme码
			// getScheme(token){
			// 	axios({
			// 		method:"POST",
			// 		url:`${this.$siteURL}/wxapi/wxa/generatescheme?access_token=${token}`,
			// 		data:{
			// 			jump_wxa:{
			// 				query:"pathId=" + this.$store.state.pathId + "&phone=" + this.$store.state.userPhone  //1.0.3版小程序
			// 			}
			// 		}
			// 	}).then(res => {
			// 		window.location.href = res.data.openlink
			// 	})
			// }
		}
	}
</script>


<style scoped>
.result{line-height: 30px;background: url(../../assets/images/bg2.png) repeat;height: calc(100vh - 20px);padding: 10px;background-size: cover;}
.part1{background: url(../../assets/images/bg1.png) no-repeat;width: 93.33vw;height: 94.2666vw;background-size: contain;text-align: center;max-width: 400px;max-height: 403px;margin: auto;}
.part1 img{max-width: 123.5px;margin-top: 85px;}
.part1 h4{font-size: 18px;color: #333;margin-bottom: 8px;font-weight: normal;}
.part1 h4 font{color: #F50E0C;}
.result .btn{color: #871C0F;letter-spacing: 2px;font-size: 20px;padding: 0px 20px;background: linear-gradient(180deg, #FBD46B 0%, #FF990D 100%);line-height: 48px;width: 200px;border-radius: 30px;display: inline-block;font-weight: 600;box-shadow: 0px 4px 8px #ddd;cursor: pointer;}

.part2{background: #fff;border-radius: 15px;margin-top: 15px;padding: 20px 25px 10px;}
.part2 h3{font-size: 20px;color: #333;text-align: center;}
.part2 .step .tit{display: inline-block;background: linear-gradient(180deg, #fff 50%, #9AE3B9 100%);font-size: 16px;color: #000;}
.part2 .step .num{display: inline-block;width: 18px;height: 18px;background: #1ACE9A;border-radius: 50%;color: #fff;font-size: 12px;line-height:18px;text-align: center;font-weight: bold;}
.part2 .step p{font-size: 17px;color: #000;margin-bottom: 20px;padding-left: 15px;padding-top: 10px;}

.part3{margin-top: 100px;text-align: center;line-height: 80px;}


@media screen and (max-width: 330px) {
	.part1 img{max-width: 100px;margin-top: 65px;}

}

</style>
